﻿<!DOCTYPE html>
<html lang="en">

<head>
    <title>CDUT - Details Fullwith</title>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="icon" href="assets/images/logocdut.jpg">
    <link href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,700i&display=swap"
        rel="stylesheet">
    <link rel="stylesheet" href="http://cdn.bootstrapmb.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/css/font-awesome.min.css">
    <link rel="stylesheet" href="assets/css/owl.carousel.min.css">
    <link rel="stylesheet" href="assets/css/animate.min.css">
    <link rel="stylesheet" href="assets/css/jquery-ui.css">
    <link rel="stylesheet" href="assets/css/slick.css">
    <link rel="stylesheet" href="assets/css/chosen.min.css">
    <link rel="stylesheet" href="assets/css/pe-icon-7-stroke.css">
    <link rel="stylesheet" href="assets/css/magnific-popup.min.css">
    <link rel="stylesheet" href="assets/css/lightbox.min.css">
    <link rel="stylesheet" href="assets/js/fancybox/source/jquery.fancybox.css">
    <link rel="stylesheet" href="assets/css/jquery.scrollbar.min.css">
    <link rel="stylesheet" href="assets/css/mobile-menu.css">
    <link rel="stylesheet" href="assets/fonts/flaticon/flaticon.css">
    <link rel="stylesheet" href="assets/css/style.css">
</head>

<body class="details-page" style="background-color: #FBAB7E;
background-image: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%);
;">
    <header class="header style7">
        <div class="top-bar">
            <div class="container">
                <div class="top-bar-left">
                    <div class="header-message">
                        欢迎
                    </div>
                </div>
                <div class="top-bar-right">

                    <ul class="header-user-links" th:if="${session.loginUser==null}">
                        <li>
                            <a th:href="@{/login}">登录/注册</a>
                        </li>
                    </ul>
                    <ul class="header-user-links" th:if="${session.loginUser!=null}">

                        <li>
                            <a>用户: </a>
                            <a th:text="${session.loginUser.username}"> </a>
                            <a> 您好！</a>
                            <a th:href="@{/user/logout}" th:text="' 注销'"></a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="container">
            <div class="main-header">
                <div class="row">
                    <div class="col-lg-3 col-sm-4 col-md-3 col-xs-7 col-ts-12 header-element"
                        style="left: 120px;padding-bottom: 0px;bottom: 35px;">
                        <div class="logo">
                            <a href="index.html">
                                <img width="50%" src="assets/images/logocdut.png" alt="img"
                                    style="width:40%;magin-top: 5px;">
                            </a>
                        </div>
                    </div>
                    <div class="col-lg-7 col-sm-8 col-md-6 col-xs-5 col-ts-12">
                        <div class="block-search-block">
                            <form class="form-search form-search-width-category">
                                <div class="form-content">
                                    <div class="category">
                                    </div>
                                    <div class="inner">
                                        <input type="text" class="input" name="s" value="" placeholder="搜索你感兴趣的商品"
                                            id="searchvalue">
                                    </div>
                                    <button class="btn-search" type="button" id="search">
                                        <span class="icon-search"></span>
                                    </button>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="header-nav-container">
            <div class="container">
                <div class="header-nav-wapper main-menu-wapper">
                    <div class="vertical-wapper block-nav-categori">
                        <div class="block-title">
                            <span class="icon-bar">
                                <span></span>
                                <span></span>
                                <span></span>
                            </span>
                            <span class="text">主页目录</span>
                        </div>
                        <div class="block-content verticalmenu-content">

                        </div>
                    </div>
                    <div class="header-nav">
                        <div class="container-wapper">
                            <ul class="CDUT-clone-mobile-menu CDUT-nav main-menu " id="menu-main-menu">
                                <li>
                                    <a th:href="@{/home}" class="CDUT-menu-item-title" title="Home">主页</a>
                                </li>
                                <li class="menu-item">
                                    <a th:href="@{/gridproducts_bannerslider}" class="CDUT-menu-item-title" title="Shop">铺子</a>
                                </li>

                                <li class="menu-item">
                                    <a th:href="@{/about}" class="CDUT-menu-item-title" title="About">关于我们</a>
                                </li>
                                <li class="menu-item">
                                    <a th:href="@{/shoppingcart}" class="CDUT-menu-item-title" title="add">发布</a>
                                </li>
                                <li class="menu-item" th:if="${session.loginUser!=null}">
                                    <a th:href="'gridproducts_bannerslider_my?uid='+${session.loginUser.uid}" class="CDUT-menu-item-title" title="add">我的</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </header>
    <div class="header-device-mobile">
        <div class="wapper">
            <div class="item mobile-logo" >
                <div class="logo">
                    <a href="#">
                        <img width="50%" src="assets/images/logocdut.png" alt="img" style="width:40%;magin-top: 5px;">
                    </a>
                </div>
            </div>
            <div class="item item mobile-search-box has-sub">
                <a href="#">
                    <span class="icon">
                        <i class="fa fa-search" aria-hidden="true"></i>
                    </span>
                </a>
                <div class="block-sub">
                    <a href="#" class="close">
                        <i class="fa fa-times" aria-hidden="true"></i>
                    </a>
                    <div class="header-searchform-box">
                        <form class="header-searchform">
                            <div class="searchform-wrap">
                                <input type="text" class="search-input" placeholder="Enter keywords to search...">
                                <input type="submit" class="submit button" value="Search">
                            </div>
                        </form>
                    </div>
                </div>
            </div>
            <div class="item mobile-settings-box has-sub">
                <a href="#">
                    <span class="icon">
                        <i class="fa fa-cog" aria-hidden="true"></i>
                    </span>
                </a>
                <div class="block-sub">
                    <a href="#" class="close">
                        <i class="fa fa-times" aria-hidden="true"></i>
                    </a>
                    <div class="block-sub-item">
                        <h5 class="block-item-title">Currency</h5>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="main-content main-content-details single no-sidebar" style="background-color: #FFDFBC;">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="breadcrumb-trail breadcrumbs">
                        <ul class="trail-items breadcrumb" style="background-color: #FFDFBC;">
                            <li class="trail-item trail-begin">
                                <a href="index.html">主页</a>
                            </li>
                            <li class="trail-item">
                                <a href="#">商品</a>
                            </li>
                            <li class="trail-item trail-end active">
                                商品详情
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="content-area content-details full-width col-lg-9 col-md-8 col-sm-12 col-xs-12">
                    <div class="site-main">
                        <div class="details-product">
                            <div class="details-thumd">
                                <div class="image-preview-container image-thick-box image_preview_container">
                                    <img id="img_zoom"
                                         th:src="'updatafile/'+${good.gname}+'.jpg'" alt="img">
                                </div>
                            </div>
                            <div class="details-infor">
                                <h1 class="product-title"  th:text="${good.gname}">
                                </h1>
                                <div class="price">
                                    <span th:text="'¥'+${good.money}">$45</span>
                                </div>
                                <div class="variations">
                                </div>
                                <div class="group-button">
                                    <div class="yith-wcwl-add-to-wishlist">
                                        <div class="yith-wcwl-add-button">
                                            <a>Add to Wishlist</a>
                                        </div>
                                    </div>
                                    <div class="size-chart-wrapp">
                                    </div>
                                    <div class="quantity-add-to-cart">
                                        <button class="single_add_to_cart_button button"
                                            th:if="${session.loginUser==null}"><a th:href="@{/login}">请登录</a></button>
                                        <button class="single_add_to_cart_button button"
                                            th:if="${session.loginUser!=null}" onclick="mail()"><a
                                                th:href="'/mail/send-by-id?gid='+${good.gid}">联系发布者</a></button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="tab-details-product">
                            <ul class="tab-link">
                                <li class="active">
                                    <a data-toggle="tab" aria-expanded="true" href="#product-descriptions">商家描述
                                    </a>
                                </li>
                            </ul>
                            <div class="tab-container">
                                <div id="product-descriptions" class="tab-panel active">
                                    <p th:text="${good.des}">
                                    </p>
                                </div>
                                <div id="information" class="tab-panel">
                                    <table class="table table-bordered">
                                        <tr>
                                            <td>Size</td>
                                            <td> XS / S / M / L</td>
                                        </tr>
                                        <tr>
                                            <td>Color</td>
                                            <td>White/ Black/ Teal/ Brown</td>
                                        </tr>
                                        <tr>
                                            <td>Properties</td>
                                            <td>Colorful Dress</td>
                                        </tr>
                                    </table>
                                </div>
                                <div id="reviews" class="tab-panel">
                                    <div class="reviews-tab">
                                        <div class="comments">
                                            <h2 class="reviews-title">
                                                1 review for
                                                <span>Eclipse Pendant Light</span>
                                            </h2>
                                        </div>
                                        <div class="review_form_wrapper">
                                            <div class="review_form">
                                                <div class="comment-respond">
                                                    <span class="comment-reply-title">Add a review </span>
                                                    <form class="comment-form-review">
                                                        <p class="comment-notes">
                                                            <span class="email-notes">Your email address will not be
                                                                published.</span>
                                                            Required fields are marked
                                                            <span class="required">*</span>
                                                        </p>
                                                        <div class="comment-form-rating">
                                                            <label>Your rating</label>
                                                            <p class="stars">
                                                                <span>
                                                                    <a class="star-1" href="#"></a>
                                                                    <a class="star-2" href="#"></a>
                                                                    <a class="star-3" href="#"></a>
                                                                    <a class="star-4" href="#"></a>
                                                                    <a class="star-5" href="#"></a>
                                                                </span>
                                                            </p>
                                                        </div>
                                                        <p class="comment-form-comment">
                                                            <label>
                                                                Your review
                                                                <span class="required">*</span>
                                                            </label>
                                                            <textarea title="review" id="comment" name="comment"
                                                                cols="45" rows="8"></textarea>
                                                        </p>
                                                        <p class="comment-form-author">
                                                            <label>
                                                                Name
                                                                <span class="">*</span>
                                                            </label>
                                                            <input title="author" id="author" name="author" type="text"
                                                                value="">
                                                        </p>
                                                        <p class="comment-form-email">
                                                            <label>
                                                                Email
                                                                <span class="">*</span>
                                                            </label>
                                                            <input title="email" id="email" name="email" type="email"
                                                                value="">
                                                        </p>
                                                        <p class="form-submit">
                                                            <input name="submit" type="submit" id="submit"
                                                                class="submit" value="Submit">
                                                        </p>
                                                    </form>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div style="clear: left;"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- <footer class="footer style7">
        <div class="container">
            <div class="container-wapper">
                <div class="row">
                    <div class="box-footer col-xs-12 col-sm-6 col-md-6 col-lg-4">
                        <div class="widget-box">
                            <div class="single-img">
                                <a href="index.html"><img width="50%" src="assets/images/logocdut.jpg" alt="img"
                                    style="width:40%;magin-top: 5px;"></a>
                            </div>
                            <ul class="menu">
                                <li class="menu-item">
                                    <a href="#"><span class="flaticon-placeholder"></span>45 Grand Central Terminal New
                                        York,NY 1017 United State USA</a>
                                </li>
                                <li class="menu-item">
                                    <a href="#"><span class="flaticon-phone-call"></span>(+123) 456 789 - (+123) 666
                                        888</a>
                                </li>
                                <li class="menu-item">
                                    <a href="#"><span class="fa fa-envelope-o"></span>Contact@yourcompany.com</a>
                                </li>
                                <li class="menu-item">
                                    <a href="#"><span class="flaticon-clock"></span>Mon-Sat 9:00pm - 5:00pm Sun :
                                        Closed</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div class="box-footer col-xs-12 col-sm-6 col-md-6 col-lg-2">
                        <div class="CDUT-custommenu default">
                            <h2 class="widgettitle">Quick Menu</h2>
                            <ul class="menu">
                                <li class="menu-item">
                                    <a href="#">Audio & Theater</a>
                                </li>
                                <li class="menu-item">
                                    <a href="#">Photo & Video</a>
                                </li>
                                <li class="menu-item">
                                    <a href="#">Headphones</a>
                                </li>
                                <li class="menu-item">
                                    <a href="#">Wireless Speakers</a>
                                </li>
                                <li class="menu-item">
                                    <a href="#">Electronics</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div class="box-footer col-xs-12 col-sm-6 col-md-6 col-lg-2">
                        <div class="CDUT-custommenu default">
                            <h2 class="widgettitle">Information</h2>
                            <ul class="menu">
                                <li class="menu-item">
                                    <a href="#">FAQs</a>
                                </li>
                                <li class="menu-item">
                                    <a href="#">Track Order</a>
                                </li>
                                <li class="menu-item">
                                    <a href="#">Delivery</a>
                                </li>
                                <li class="menu-item">
                                    <a href="#">Contact Us</a>
                                </li>
                                <li class="menu-item">
                                    <a href="#">Return</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <div class="box-footer col-xs-12 col-sm-6 col-md-6 col-lg-4">
                        <div class="CDUT-newsletter style1">
                            <div class="newsletter-head">
                                <h3 class="title">Newsletter</h3>
                            </div>
                            <div class="newsletter-form-wrap">
                                <div class="list">
                                    Get notified of new products, limited releases, and more.
                                </div>
                                <input type="email" class="input-text email email-newsletter"
                                    placeholder="Your email letter">
                                <button class="button btn-submit submit-newsletter">SUBSCRIBE</button>
                            </div>
                        </div>
                        <div class="CDUT-socials">
                            <ul class="socials">
                                <li>
                                    <a href="#" class="social-item" target="_blank">
                                        <i class="icon fa fa-facebook"></i>
                                    </a>
                                </li>
                                <li>
                                    <a href="#" class="social-item" target="_blank">
                                        <i class="icon fa fa-twitter"></i>
                                    </a>
                                </li>
                                <li>
                                    <a href="#" class="social-item" target="_blank">
                                        <i class="icon fa fa-instagram"></i>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-sm-12 border-custom">
                        <span></span>
                    </div>
                </div>
                <div class="footer-end">
                    <div class="row">
                        <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                            <div class="coppyright">
                                Copyright © 2019
                                <a href="http://www.bootstrapmb.com">CDUT</a>
                                . All rights reserved
                            </div>
                        </div>
                        <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
                            <div class="CDUT-payment">
                                <img src="assets/images/payments.png" alt="img">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </footer> -->
    <div class="footer-device-mobile">
        <div class="wapper">
            <div class="footer-device-mobile-item device-home">
                <a href="index.html">
                    <span class="icon">
                        <i class="fa fa-home" aria-hidden="true"></i>
                    </span>
                    Home
                </a>
            </div>
            <div class="footer-device-mobile-item device-home device-wishlist">
                <a href="#">
                    <span class="icon">
                        <i class="fa fa-heart" aria-hidden="true"></i>
                    </span>
                    Wishlist
                </a>
            </div>
            <div class="footer-device-mobile-item device-home device-cart">
                <a href="#">
                    <span class="icon">
                        <i class="flaticon-online-shopping-cart" aria-hidden="true"></i>
                        <span class="count-icon">
                            0
                        </span>
                    </span>
                    <span class="text">Cart</span>
                </a>
            </div>
            <div class="footer-device-mobile-item device-home device-user">
                <a href="login.html">
                    <span class="icon">
                        <i class="flaticon-profile" aria-hidden="true"></i>
                    </span>
                    Account
                </a>
            </div>
        </div>
    </div>
    <a href="#" class="backtotop">
        <i class="pe-7s-angle-up"></i>
    </a>
    <script src="assets/js/jquery-1.12.4.min.js"></script>
    <script src="assets/js/jquery.plugin-countdown.min.js"></script>
    <script src="assets/js/jquery-countdown.min.js"></script>
    <script src="http://cdn.bootstrapmb.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="assets/js/owl.carousel.min.js"></script>
    <script src="assets/js/magnific-popup.min.js"></script>
    <script src="assets/js/isotope.min.js"></script>
    <script src="assets/js/jquery.scrollbar.min.js"></script>
    <script src="assets/js/jquery-ui.min.js"></script>
    <script src="assets/js/mobile-menu.js"></script>
    <script src="assets/js/chosen.min.js"></script>
    <script src="assets/js/slick.js"></script>
    <script src="assets/js/jquery.elevateZoom.min.js"></script>
    <script src="assets/js/jquery.actual.min.js"></script>
    <script src="assets/js/fancybox/source/jquery.fancybox.js"></script>
    <script src="assets/js/lightbox.min.js"></script>
    <script src="assets/js/owl.thumbs.min.js"></script>
    <script src="assets/js/jquery.scrollbar.min.js"></script>
    <script src='http://ditu.google.cn/maps/api/js?key=AIzaSyC3nDHy1dARR-Pa_2jjPCjvsOR4bcILYsM'></script>
    <script src="assets/js/frontend-plugin.js"></script>
    <script type="text/javascript">
        var searchbtn=document.getElementById("search");
        searchbtn.onclick=function ()
        {
            name=document.getElementById("searchvalue").value;
            if(name=="")
            {
                alert("请填写要搜索的商品名称");
                return;
            }
            var xhr = new XMLHttpRequest();
            var params = "name="+name;
            xhr.open("GET", "/good/querygoodbyname2?"+params, true);
            xhr.send();
            xhr.onload = function () {
                document.write(xhr.responseText);
            }
        }
    </script>
    <script type="text/javascript">
        function mail() {
           alert("已经联系卖家，请耐心等待!");
        }
    </script>
</body>

</html>